import { defineConfig } from 'vite'
import { resolve } from 'path'
import react from '@vitejs/plugin-react'
import AutoImport from 'unplugin-auto-import/vite'
import ImportConfig from './import_config'
import { visualizer } from 'rollup-plugin-visualizer'

// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
  console.log(mode)
  return {
    plugins: [
      react(),
      AutoImport({
        include: [
          /\.[tj]sx?$/ // .ts, .tsx, .js, .jsx
        ],
        imports:
          // @ts-ignore
          [{ ...ImportConfig }],

        dts: 'src/auto-import.d.ts'
      }),
      visualizer({ open: true })
    ],
    resolve: {
      alias: {
        '@': resolve(__dirname, 'src')
      }
    },
    css: {
      preprocessorOptions: {
        scss: {
          api: 'modern-compiler'
        }
      }
    },
    base: mode === 'development' ? '/' : './',
    build: {
      rollupOptions: {
        output: {
          manualChunks: {
            'react-lib': ['react', 'react-dom', 'react-device-detect', 'react-perfect-scrollbar'],
            'ui-lib': ['@mui/material', '@mui/system', '@mui/lab', '@mui/icons-material', '@tabler/icons-react'],
            'third-lib': ['lodash', 'ahooks']
          }
        }
      }
    }
  }
})
